.header {
  display: flex;
  justify-content: space-between;
  height: 64px;
  border-radius: 3px;
  border: 1px solid rgba(151, 151, 151, 0.3);
  background-color: #ffffff;
  user-select: none;

  .breadcrumb {
    color: #2f3d5d;
    padding-left: 24px;
    margin-bottom: 0;
    line-height: 64px;

    .content {
      padding-left: 4px;
    }
  }

  .tabButtonContainer {
    display: flex;

    .tabButton {
      overflow: hidden;
      cursor: pointer;
      height: 100%;
      line-height: 64px;
      font-size: 18px;
      padding: 0 24px;
      transition-property: background-color, color;
      transition-duration: 0.3s;
      transition-timing-function: cubic-bezier(0.78, 0.14, 0.15, 0.86);

      &--active {
        color: #2f3d5d;
        background-color: #f3f3f3;
        border-bottom: 3px solid #2f3d5d;
      }

      &--last {
        border-top-right-radius: 4px;
        border-bottom-right-radius: 4px;
      }
    }

    .splitLine {
      height: 100%;
      width: 1px;
      background-color: #e0e0e0;
    }
  }
}
